import QtQuick 1.1

Rectangle{
    id: rootItem;
    width: 320; height: 320;
    color: "black";

    GridView{
        id: gridView;
        anchors.fill: parent;
        delegate:contantDelegate;
        model: ContantModel{ }
    }

    Component{
        id: contantDelegate;
        ContantRect{
            color: "grey";
            width: 40; height: 50;
            text: name;
            onClicked: {
                loadDetail(name, phone, info);
            }
        }
    }

//    function setText(object, str){
//        object.text = str;
//    }

    function loadDetail(name, phone, info){
        console.log("--> loadDetail:" + name + phone + info);
        var comp = Qt.createComponent("ContantRect.qml");
        var object = comp.createObject(rootItem, {"width": rootItem.width*.8,
                                                  "height": rootItem.height*.8,
                                                  "x": 20, "y": 20});
        object. text = "<b>" + "Detail: "+"</b><br>" +"<b>" + name + "</b>" + "<br>" + phone + "<br>" + info;
        object.clicked.connect(close(/*object*/));
    }

    function close(/*object*/){
        console.log(" clicked onScreen");
        //object.destroy();
    }
}


